<!-- <template>
  <el-tabs
    v-model="editableTabsValue"
    type="card"
    class="demo-tabs"
    @tab-remove="removeTab"
  >
    <el-tab-pane
      v-for="item in editableTabs"
      :key="item.name"
      :label="item.title"
      :name="item.name"
      :closable="item.name !== '1'"
    >
      <template v-if="item.name === '1'">
        <div>index</div>
      </template>
    </el-tab-pane>
  </el-tabs>
</template> -->
<template>
  <div>index首页</div>
</template>

<script setup lang="ts">
import axios from "axios";
import { Search } from "@element-plus/icons-vue";
import { onMounted, ref, reactive } from "vue";
import { ElMessage } from "element-plus";

// 新建日志标签页
const taskPresentationRef = ref();
let tabIndex = 1;
const editableTabsValue = ref("1");
interface Tab {
  title: string;
  name: string;
  content: string;
  unique_name: string;
  unique_code: string;
  taskId: number;
  filename: string;
  telemetry_code: string;
}
const editableTabs = ref<Tab[]>([
  {
    title: "阈值挖掘",
    name: "1",
    content: "",
    unique_name: "",
    taskId: 0,
    filename: "",
    telemetry_code: "",
    unique_code: "",
  },
]);
const addTab = (msg: string, taskId: number, name: string) => {
  const newTabName = `${++tabIndex}`;
  editableTabs.value.push({
    title: name + "日志",
    name: newTabName,
    content: msg,
    unique_name: name,
    taskId: taskId,
    filename: "",
    telemetry_code: "",
    unique_code: "",
  });
  editableTabsValue.value = newTabName;
};

// 新建配置表标签页
const addConfigTab = (code: string, name: string) => {
  const configTabIndex =
    editableTabs.value.filter((tab) => tab.name.startsWith("config-")).length +
    1; // 计算新的配置表索引
  const newTabName = `config-${configTabIndex}`; // 创建唯一的标签名
  editableTabs.value.push({
    // title: `配置表 ${configTabIndex}`,
    title: name + "配置表",
    name: newTabName,
    content: "",
    unique_name: name,
    taskId: 0,
    filename: "",
    telemetry_code: "",
    unique_code: code,
  });
  editableTabsValue.value = newTabName; // 设置新标签为当前激活标签
};

const addResultTab = (taskId: number, name: string, code: string) => {
  const resultTabIndex =
    editableTabs.value.filter((tab) => tab.name.startsWith("result-")).length +
    1; // 计算新索引
  const newTabName = `result-${resultTabIndex}`; // 创建唯一的标签名
  editableTabs.value.push({
    title: name + "结果表",
    name: newTabName,
    content: "",
    unique_name: name,
    taskId: taskId,
    filename: "",
    telemetry_code: "",
    unique_code: code,
  });
  editableTabsValue.value = newTabName; // 设置新标签为当前激活标签
};

const addTableTab = (filename: string, code: string, name: string) => {
  debugger;
  const tableTabIndex =
    editableTabs.value.filter((tab) => tab.name.startsWith("table-")).length +
    1; // 计算新索引
  const newTabName = `table-${tableTabIndex}`; // 创建唯一的标签名
  editableTabs.value.push({
    title: name +" "+ filename + "具体结果表",
    name: newTabName,
    content: "",
    unique_name: name,
    taskId: 0,
    filename: filename,
    telemetry_code: "",
    unique_code: code,
  });
  editableTabsValue.value = newTabName;
};
const addSourceTab = (telemetry_code: string, code: string) => {
  debugger;
  const sourceTabIndex =
    editableTabs.value.filter((tab) => tab.name.startsWith("source-")).length +
    1; // 计算新索引
  const newTabName = `source-${sourceTabIndex}`; // 创建唯一的标签名
  editableTabs.value.push({
    title: code + telemetry_code + "配置参数溯源表",
    name: newTabName,
    content: "",
    unique_name: "",
    taskId: 0,
    filename: "",
    telemetry_code: telemetry_code,
    unique_code: code,
  });
  editableTabsValue.value = newTabName;
};

//关闭标签页
const removeTab = (targetName: string) => {
  const tabs = editableTabs.value;
  let activeName = editableTabsValue.value;
  if (activeName === targetName) {
    tabs.forEach((tab, index) => {
      if (tab.name === targetName) {
        const nextTab = tabs[index + 1] || tabs[index - 1];
        if (nextTab) {
          activeName = nextTab.name;
        }
      }
    });
  }
  editableTabsValue.value = activeName;
  editableTabs.value = tabs.filter((tab) => tab.name !== targetName);
};
// function addConfigTab() {
//   ElMessage({
//     message: "拉取数据成功！",
//     type: "success",
//   });
// }

// defineExpose({
//   addTab,
// });
</script>
